<template>
  <el-form slot="form" :model="formData" :rules="rules" ref="roleForm" label-width="80px">
    <el-form-item label="用户名称" required prop="userName" label-width="80px">
      <el-input size="small" clearable v-model="formData.userName"  class="pc-input-auto"></el-input>
    </el-form-item>
    <el-form-item label="手机号码" required prop="mobileNo" label-width="80px">
      <el-input size="small" clearable v-model="formData.mobileNo" class="pc-input-auto"></el-input>
    </el-form-item>
    <el-form-item label="邮件" prop="email" label-width="80px">
      <el-input size="small" clearable v-model="formData.email" class="pc-input-auto"></el-input>
    </el-form-item>
    <el-form-item label="备注"  prop="remark" label-width="80px">
      <el-input size="small" clearable v-model="formData.remark" class="pc-input-auto"></el-input>
    </el-form-item>
  </el-form>
</template>
<script>
  import maValidate from 'utils/common-method/validate/index';
  import {validateTips} from 'utils/tips';
  export default {
    props: {
      formData: {
        type: Object
      },
      type: {
        type: String,
        required: true
      }
    },
    data() {
      return {
        rules: {
          mobileNo: [
            { required: true, message: validateTips.NOT_EMPTY, trigger: 'blur' },
            { min: 0, max: 11, message: validateTips.PHONE_LENGTH, trigger: 'blur' },
            { validator: maValidate.checkMobileNo, trigger: 'blur' }
          ],
          userName: [
            { required: true, message: validateTips.NOT_EMPTY, trigger: 'blur' },
            { min: 0, max: 20, message: validateTips.LESS_20, trigger: 'blur' },
            { validator: maValidate.checkRoleName, trigger: 'blur' }
          ],
          remark: [
            { required: true, message: validateTips.NOT_EMPTY, trigger: 'blur' },
            { min: 0, max: 200, message: validateTips.WORD_LESS_150, trigger: 'blur' }
          ]
        }
      };
    },
    methods: {
      submitForm(fn) {
        this.$refs['roleForm'].validate((valid) => {
          if (!valid) {
            return false;
          }
          this.saveRoleFn(fn);
        });
      },
      saveRoleFn(fn) {
        this.ajax({
          url: '/test/user/update',
          data: this.formData || '',
          loading: true,
          success: (res) => {
            fn && fn(res);
            this.loadPage('testUserList');
            this.successTip('成功');
          }
        });
      }
    }
  };
</script>
